@import '@/style/common.scss';

.layout {
	height: 100vh;
	background-repeat: no-repeat;
	background-size: 100% 624rpx;

	&-main {
		padding: 0 28rpx;

		&-avatar {
			display: flex;
			align-items: center;

			color: #fff;
			font-size: 36rpx;
			font-weight: bold;

			image {
				width: 120rpx;
				height: 120rpx;
				margin-right: 24rpx;
				border-radius: 50%;
			}
		}

		&-content {
			height: 610rpx;
			margin: 0 -28rpx;
			padding: 88rpx 60rpx 98rpx 66rpx;
			background-repeat: no-repeat;
			background-size: 100% 610rpx;

			&-item {
				min-height: 84rpx;
				display: flex;
				margin-top: 48rpx;

				&:first-child {
					margin-top: 0;
				}

				&-left {
					height: 84rpx;
					line-height: 84rpx;
					color: #333;
					width: 135rpx;
					font-size: 26rpx;
				}

				&-right {
					flex: 1;
					position: relative;

					input {
						color: #333;
						height: 84rpx;
						line-height: 84rpx;
						padding: 0 70rpx 0 24rpx;
						background: #f6f6f6;
						border-radius: 16rpx;
						font-size: 26rpx;
					}

					textarea {
						color: #333;
						width: 100%;
						height: 240rpx;
						padding: 30rpx 20rpx 20rpx;
						background: #f6f6f6;
						border-radius: 16rpx;
						font-size: 26rpx;
					}

					image {
						position: absolute;
						top: 22rpx;
						right: 20rpx;
						width: 40rpx;
						height: 40rpx;
						z-index: 999;
					}

					/deep/ .placeholder {
						color: #666;
						font-size: 26rpx;
					}
				}
			}
		}
	}

	&-footer {
		padding: 10rpx 28rpx 0;

		button {
			@include Db_commonButton(92rpx, 46rpx);
		}
	}
}
